<template>
    <div id="echarts_box" style="width: 600px;height: 400px;"></div>
</template>

<script>
import * as echarts from "echarts";

export default {
    data() {
        return{
            // name: "张雪",
            // xData: ["2020-02","2020-03","2020-04"],
            // yData: [30,132,80,500]
        }
    },
    mounted(){
        const option={
          title: {
            text: "Echarts 入门示例"
          },
          tooltip: {},
          legend: {
              data: ["销量"]
          },
          // xAxis: {
          //   //data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋"]
          // },
          // yAxis: {},
          series: [
                  {
                    type: 'pie',
                    data: [
                      {
                        value: 335,
                        name: '直接访问'
                      },
                      {
                        value: 234,
                        name: '联盟广告'
                      },
                      {
                        value: 1548,
                        name: '搜索引擎'
                      }
                    ],
                    radius: '50%'
                  }
                ]
                      };
        const myChart=echarts.init(document.getElementById('echarts_box'))
        myChart.setOption(option);
        window.addEventListener("resize",()=>{
          myChart.resize();
        })
    },

}
</script>

<style scoped>
</style>